.dog {
    position: absolute;
    z-index: 10;
    transform: scaleX(1);
    animation: dogEntry forwards,
}

.dog.running {
    display: block;
    animation: dogEntry 6s ease-in-out forwards,
        dogRunningAnimation 0.2s steps(2) infinite;
}

@keyframes dogEntry {
    0% {}

    100% {
        left: var(--dog-stop-x);
        top: var(--dog-stop-y);
    }
}

@keyframes dogRunningAnimation {
    from {
        content: url('@/assets/p1/dog_standing.png');
    }

    to {
        content: url('@/assets/p1/dog_running.png');
    }
}

@keyframes dogRunningAnimation2 {
    from {
        content: url('@/assets/p1/dog_standing.png');
    }

    to {
        content: url('@/assets/p1/dog_running.png');
    }
}